<template>
	<view class="u-flex good-item">
		<up-image :src="item.logo" :width="style.width"
		 :height="style.height" :radius="style.radius"  :fade="false" >
			<template #error>
				 <up-image :src="ee.wxapp.photoface"  :width="style.width"
					:height="style.height" :radius="style.radius"  ></up-image>						 
			</template> 
		</up-image>
		
		<view class="title-info u-flex u-flex-column u-flex-between u-margin-left-20 u-flex-grow">
			<view class="title u-flex u-flex-between">
				 <navigator :url="'/pages/mall/show?id='+item.id">
					<view class="u-flex-grow">
						<view class="u-line-2">
							<text class="font-weight" :class="[small?'font-size14':'font-size15']">{{ item.title }}</text>
						</view>	
						<view class="u-margin-top-15">
							<text class="font-size12 color-gray">{{item.sub_title}}</text>
						</view>		
					</view>
				</navigator>	
									
			</view>
			<view class="title-btn u-flex u-flex-between">
				<view class="buy-num">
					<text class="font-size11" :style="{color:ee.bgColor.second}">{{item.virtual_sales}}人</text>
					<text class="font-size11 color-gray">付款</text>
				</view>
				<view class="buy-go">
					 
					<view class="price color-red font-weight">
						
						<view v-if="(item.min_price)">
							<text class="font-size11">¥</text>
							<text class="font-size16">{{ item.min_price }}</text>
							<text class="font-size10">起</text>
						</view>
						<view v-else-if="(item.price)">
							<text class="font-size11">¥</text>
							<text class="font-size16">{{ item.price }}</text>
							<text class="font-size10"></text> 
						</view>
						<view v-else><text class="font-size10 color-gray">无票</text></view>
						
					</view>		
					 
				</view>
			</view>
		</view>
		
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted,
		onActivated,
		watchEffect,
		provide,
		nextTick,
		computed,
		reactive
	} from 'vue';
	
	const style = computed(()=>{
		if(props.small) {
			return {
				width: 85,
				height: 85,
				 radius:8
			}
		}else{
			return {
				width: 95,
				height: 95 ,
				 radius:4
			}
		}
	})
	
	
	
	const props = defineProps({
		// 导航列表
		item: {
			type: Object,
			default:  {}
		}, 
		small :{
			type: Boolean,
			default: false,
		}
	});
   
</script>

<style>
	.good-item{
		max-width: 750px;
	}
	.title{
		color: #2F2F2F;
	}
</style>